<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Layui</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/Smart_Backstage/layui/css/layui.css">
    <script src="/Smart_Backstage/layui/layui.js" charset="utf-8"></script>
    <script src="\Smart_Backstage\js\jquery-3.4.1.js"></script>

    <style type="text/css">

        .layui-body{
            background-color: #F0F0F0;
        }

        #doContainer{
            background-color: white;
            border-top: 2px solid #1E9FFF;
            margin: 20px;
            border-radius:10px;
        }

        #tableDiv{
            padding: 25px;
        }


        #daohTitle{
            padding-top: 25px;
            padding-left: 35px;
            padding-bottom: 15px;
            display: inline-block;
        }

        #imgDiv img{
            width: 200px;
            height: 200px;
        }

        #close{
            width: 80px;
        }

        .layui-body{
            background-color: #F0F0F0;
        }

        #doContainer{
            background-color: white;
            border-top: 2px solid #1E9FFF;
            margin: 20px;
            border-radius:10px;
        }

        #tableDiv{
            padding: 25px;
        }

        #daohTitle{
            padding-top: 25px;
            padding-left: 35px;
            padding-bottom: 15px;
            display: inline-block;
        }

        .selectContainer{
            margin-top: 20px;
        }
        #price{
            margin-top: 20px;
        }

        #demo2 img{
            width: 300px;
            height: 300px;
        }


        .layui-btn  input {
            position: absolute;
            font-size: 100px;
            right: 0;
            top: 0;
            opacity: 0;
            filter: alpha(opacity=0);
            cursor: pointer
        }


    </style>

</head>

<body class="layui-layout-body">

<div class="layui-layout layui-layout-admin">

    <div class="header"></div>

    <div class="left"></div>

    <div class="layui-body">
        <!-- 内容主体区域-->
        <div id="doContainer">
                <span class="layui-breadcrumb" id="daohTitle">
                    <a href="index.html">首页</a>
                    <a href="#">所有商品</a>
                    <a><cite>二手汽车</cite></a>
                </span>

            <div id="tableDiv">

                <div class="layui-btn-group demoTable">
                    <button class="layui-btn" data-type="getCheckLength">删除</button>
                    <button class="layui-btn" data-type="isAll">刷新</button>
                </div>

                <table class="layui-table" lay-filter="demo" id="demo" ></table>
            </div>
        </div>
    </div>

    <div class="footer"></div>

</div>



<script id="barDemo" type="text/html">
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>

<script id="checkboxTpl" type="text/html">
    <input type="checkbox" name="lock" value="{{d.id}}" title="激活" lay-filter="lockDemo"  {{d.status==1?'checked':''}}>
</script>


<script>

    var formData = new FormData();//jaxa上传的数据
    var count = 0;//图片的数量

    /*
        加载图片以及把图片写入formData里面
     */
    function showImg(fileObj,id){
        var file = fileObj.files[fileObj.files.length-1];
        var type = file.type+"";

        if(type.indexOf("image")!=-1){
            formData.append('files', file);
            count ++;

            var fileReader = new FileReader(); //创建一个filereader对象
            var img = new Image();  //创建一个图片对象
            fileReader.readAsDataURL(file)  //读取所上传对的文件
            fileReader.onload = function(){
                $(id).append('<img src="'+ this.result +'" class="layui-upload-img">')  //添加到预览区域
            }
        }else{
            alert("请选择图片！！！")
        }
    }

    layui.use(['table','laydate','layer'], function(){
        var table = layui.table,
            $ = layui.jquery,
            layer = layui.layer,
            laydate = layui.laydate,
            form = layui.form;

        //监听表格复选框选择
        table.on('checkbox(demo)', function(obj){
            console.log(obj)
        });


        //时间初始化
        function showTime(time){
            var date = new Date(time);
            var year = date.getFullYear();
            var month = date.getMonth();
            var day = date.getDate();
            if (month >= 1 && month <= 9) {
                month = "0" + month;
            }
            if (day >= 0 && day <= 9) {
                day = "0" + day;
            }
            return year+'-'+month+'-'+day;
        }



        //数据的查看，编辑，删除
        table.on('tool(demo)', function(obj){
            var data = obj.data;
            if(obj.event === 'detail'){//查看详情
                dialog2(data.id);
            } else if(obj.event === 'del'){
                layer.confirm('真的删除行么', function(index){
                    var arrId = [];
                    arrId.push(data.id);
                    $.ajax({
                        // 编写json格式，设置属性和值
                        url: "/Smart_Backstage/smart/del",
                        contentType: "application/json;charset=UTF-8",
                        data: JSON.stringify(arrId),
                        dataType: "json",
                        type: "post",
                        success: function (data) {
                            obj.del();
                            layer.close(index);
                        }
                    })

                });
            } else if(obj.event === 'edit'){
                $.ajax({
                    url: '/Smart_Backstage/smart/message',
                    contentType: 'application/json;charset=UTF-8',
                    data: JSON.stringify(data.id),
                    dataType: 'json',
                    type: 'post',
                    success: function (data) {
                        dialog(data);
                    }
                });

            }
        });

        //触发事件
        var active = {
            getCheckLength: function(){ //选中删除
                var checkStatus = table.checkStatus('demo')
                    ,data = checkStatus.data;
                if(data.length==0){
                    layer.msg("没有选中内容");
                }else{
                    var arrID = [];
                    for(var i = 0;i<data.length;i++){
                        arrID.push(data[i].id)
                    }
                    $.ajax({
                        // 编写json格式，设置属性和值
                        url: "/Smart_Backstage/smart/del",
                        contentType: "application/json;charset=UTF-8",
                        data: JSON.stringify(arrID),
                        dataType: "json",
                        type: "post",
                        success: function (data) {
                            if(data == 1){
                                render();
                            }
                        }
                    })
                }
            }
            ,isAll: function(){ //刷新
                render();
            }
        };

        $('.demoTable .layui-btn').on('click', function(){
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });



        render();

        function render(){
            table.render({
                elem: '#demo'
                ,url: '/Smart_Backstage/smart/findAll'
                ,page:true
                ,cols: [[ //标题栏
                    {type: 'checkbox', fixed: 'left'}
                    ,{field: 'id', title: 'ID', width: 80, sort: true}
                    ,{field: 'title', title: '标题', width: 300}
                    ,{field: 'message', title: '商品内容', minWidth: 100}
                    ,{field: 'name', title: '发布者', width: 120,templet:'<div>{{d.user.name}}</div>'}
                    ,{field: 'date', title: '发布时间', width: 120,templet:function(d){ return showTime(d.date)}}
                    ,{field: 'status', title: '是否激活', width: 120,templet: '#checkboxTpl', unresize: true}
                    ,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:210}
                ]]
                ,parseData: function(pageInfo){ //res 即为原始返回的数据
                    return {
                        "code": 0, //解析接口状态
                        "msg": '内容为空', //解析提示文本
                        "count": pageInfo.total, //解析数据长度
                        "data": pageInfo.list //解析数据列表
                    };
                }
            });
        }

        //激活监听
        form.on('checkbox(lockDemo)', function(obj){
            //alert(obj.data.id);
            $.ajax({
                // 编写json格式，设置属性和值
                url: "/Smart_Backstage/smart/lock",
                contentType: "application/json;charset=UTF-8",
                data: JSON.stringify({id:parseInt(this.value),flag:obj.elem.checked}),
                dataType: "json",
                type: "post",
                success: function (data) {
                    if(data==1){
                        layer.tips(obj.value + '：'+ obj.elem.checked, obj.othis);
                    }
                }
            })
        });



        //查看的dialog
        function dialog(data){
            layer.open({
                type: 1
                ,title: false //不显示标题栏
                ,closeBtn: false
                ,area: ['1000px','500px']
                ,shade: 0.8
                ,id: 'LAY_layuipro' //设定一个id，防止重复弹出
                ,btnAlign: 'c'
                ,content:
                    '<div style="padding: 50px; line-height: 22px; background-color: #393D49; color: #fff; font-weight: 300;">' +
                    '    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;margin-bottom: 20px; margin-bottom: 40px;" >\n' +
                    '        <legend>查看商品信息</legend>\n' +
                    '    </fieldset>' +
                    '            <div id="tableDiv" >\n' +
                    '                <form class="layui-form" action="">\n' +
                    '                    <input type="text" name="userId" value="'+data.userId+'" autocomplete="off" style="display: none;" class="layui-input">\n' +
                    '                    <input type="text" name="id" value="'+data.id+'"  autocomplete="off" style="display: none;" class="layui-input">\n' +
                    '                    <div class="layui-form-item">\n' +
                    '                        <label class="layui-form-label">标题名称</label>\n' +
                    '                        <div class="layui-input-block">\n' +
                    '                            <input type="text" value="'+data.title+'" name="title" required  lay-verify="required" placeholder="请输入标题" autocomplete="off" class="layui-input">\n' +
                    '                        </div>\n' +
                    '                    </div>\n' +
                    '                    <div class="layui-form-item layui-col-md5" id="price">\n' +
                    '                        <label class="layui-form-label">价格</label>\n' +
                    '                        <div class="layui-input-block">\n' +
                    '                            <input type="text" value="'+data.money+'" name="money" required  lay-verify="price" placeholder="请输入价格" autocomplete="off" class="layui-input">\n' +
                    '                        </div>\n' +
                    '                    </div>\n' +
                    '                    <div class="layui-row layui-form-item " >\n' +
                    '                        <div class=" layui-col-md5 selectContainer">\n' +
                    '                            <label class="layui-form-label">座位数</label>\n' +
                    '                            <div class="layui-input-inline" style="color: black;">\n' +
                    '                                <select name="num" lay-verify="required" >\n' +
                    '                                    <option value=""></option>\n' +
                    '                                    <option value="2">2</option>\n' +
                    '                                    <option value="4">4</option>\n' +
                    '                                    <option value="5">5</option>\n' +
                    '                                </select>\n' +
                    '                            </div>\n' +
                    '                        </div>\n' +
                    '                        <div class=" layui-col-md5 selectContainer" >\n' +
                    '                            <label class="layui-form-label">驱动形式</label>\n' +
                    '                            <div class="layui-input-inline" style="color: black;">\n' +
                    '                                <select name="driving" lay-verify="required">\n' +
                    '                                    <option value=""></option>\n' +
                    '                                    <option value="前置前驱">前置前驱</option>\n' +
                    '                                    <option value="前置后驱">前置后驱</option>\n' +
                    '                                    <option value="中置后驱">中置后驱</option>\n' +
                    '                                    <option value="后置后驱">后置后驱</option>\n' +
                    '                                    <option value="四驱">四驱</option>\n' +
                    '                                </select>\n' +
                    '                            </div>\n' +
                    '                        </div>\n' +
                    '                        <div class=" layui-col-md5 selectContainer">\n' +
                    '                            <label class="layui-form-label">电机类型</label>\n' +
                    '                            <div class="layui-input-inline" style="color: black;">\n' +
                    '                                <select name="motor" lay-verify="required">\n' +
                    '                                    <option value=""></option>\n' +
                    '                                    <option value="永磁同步电动机">永磁同步电动机</option>\n' +
                    '                                    <option value="磁阻同步电动机">磁阻同步电动机</option>\n' +
                    '                                    <option value="磁滞同步电动机">磁滞同步电动机</option>\n' +
                    '                                    <option value="感应电动机（三相异步电动机）">感应电动机（三相异步电动机）</option>\n' +
                    '                                    <option value="感应电动机（单相异步电动机）">感应电动机（单相异步电动机）</option>\n' +
                    '                                    <option value="感应电动机（罩极异步电动机）">感应电动机（罩极异步电动机）</option>\n' +
                    '                                    <option value="交流换向器电动机">交流换向器电动机</option>\n' +
                    '                                    <option value="单相串励电动机">单相串励电动机</option>\n' +
                    '                                    <option value="交直流两用电动机">交直流两用电动机</option>\n' +
                    '                                    <option value="推斥电动机">推斥电动机</option>\n' +
                    '                                </select>\n' +
                    '                            </div>\n' +
                    '                        </div>\n' +
                    '                        <div class=" layui-col-md5 selectContainer" >\n' +
                    '                            <label class="layui-form-label">电池类型</label>\n' +
                    '                            <div class="layui-input-inline" style="color: black;">\n' +
                    '                                <select name="cell" lay-verify="required">\n' +
                    '                                    <option value=""></option>\n' +
                    '                                    <option value="镍镉电池">镍镉电池</option>\n' +
                    '                                    <option value="镍氢电池">镍氢电池</option>\n' +
                    '                                    <option value="锂离子电池">锂离子电池</option>\n' +
                    '                                    <option value="锂聚合物电池">锂聚合物电池</option>\n' +
                    '                                    <option value="铅酸电池">铅酸电池</option>\n' +
                    '                                </select>\n' +
                    '                            </div>\n' +
                    '                        </div>\n' +
                    '                        <div class=" layui-col-md5 selectContainer">\n' +
                    '                            <label class="layui-form-label">长度</label>\n' +
                    '                            <div class="layui-input-inline">\n' +
                    '                                <input name="length" value="'+data.length+'" class="layui-input" type="text" placeholder="单位（mm）" required  lay-verify="mm" autocomplete="off">\n' +
                    '                            </div>\n' +
                    '                        </div>\n' +
                    '                        <div class=" layui-col-md5 selectContainer">\n' +
                    '                            <label class="layui-form-label">宽度</label>\n' +
                    '                            <div class="layui-input-inline">\n' +
                    '                                <input name="width" value="'+data.width+'" class="layui-input" type="text" placeholder="单位（mm）" required  lay-verify="mm" autocomplete="off">\n' +
                    '                            </div>\n' +
                    '                        </div>\n' +
                    '                        <div class=" layui-col-md5 selectContainer">\n' +
                    '                            <label class="layui-form-label">高度</label>\n' +
                    '                            <div class="layui-input-inline">\n' +
                    '                                <input name="height" value="'+data.height+'" class="layui-input" type="text" placeholder="单位（mm）" required  lay-verify="mm" autocomplete="off">\n' +
                    '                            </div>\n' +
                    '                        </div>\n' +
                    '                        <div class=" layui-col-md5 selectContainer">\n' +
                    '                            <label class="layui-form-label">电池容量</label>\n' +
                    '                            <div class="layui-input-inline">\n' +
                    '                                <input name="capacity" value="'+data.capacity+'" class="layui-input" type="text" placeholder="单位（kwh）" required  lay-verify="capacity" autocomplete="off">\n' +
                    '                            </div>\n' +
                    '                        </div>\n' +
                    '                        <div class=" layui-col-md5 selectContainer">\n' +
                    '                            <label class="layui-form-label">直流快充时间(30%->80%)</label>\n' +
                    '                            <div class="layui-input-inline">\n' +
                    '                                <input name="time1" value="'+data.time1+'" class="layui-input" type="text" placeholder="单位（min）" required  lay-verify="time1" autocomplete="off">\n' +
                    '                            </div>\n' +
                    '                        </div>\n' +
                    '                        <div class=" layui-col-md5 selectContainer">\n' +
                    '                            <label class="layui-form-label">交流慢充时间(30%->80%)</label>\n' +
                    '                            <div class="layui-input-inline">\n' +
                    '                                <input name="time2" value="'+data.time2+'" class="layui-input" type="text" placeholder="单位（h）" required  lay-verify="time2" autocomplete="off">\n' +
                    '                            </div>\n' +
                    '                        </div>\n' +
                    '                        <div class=" layui-col-md5 selectContainer">\n' +
                    '                            <label class="layui-form-label">最高车速</label>\n' +
                    '                            <div class="layui-input-inline">\n' +
                    '                                <input name="maxSpeed" value="'+data.maxSpeed+'" class="layui-input" type="text" placeholder="单位（h/km）" required  lay-verify="speed" autocomplete="off">\n' +
                    '                            </div>\n' +
                    '                        </div>\n' +
                    '                    </div>\n' +
                    '                    <div class="layui-form-item layui-form-text">\n' +
                    '                        <label class="layui-form-label">汽车信息</label>\n' +
                    '                        <div class="layui-input-block">\n' +
                    '                            <textarea name="message" id="message" placeholder="请输入内容" lay-verify="required" class="layui-textarea"></textarea>\n' +
                    '                        </div>\n' +
                    '                    </div>\n' +
                    '                    <div class="layui-form-item">\n' +
                    '                        <label class="layui-form-label">是否激活</label>\n' +
                    '                        <div class="layui-input-block">\n' +
                    '                            <input name="lock" type="checkbox" lay-skin="switch" lay-text="ON|OFF">\n' +
                    '                        </div>\n' +
                    '                    </div>\n' +
                    '                    <div class="layui-form-item">\n' +
                    '                        <label class="layui-form-label">图片链接</label>\n' +
                    '                        <div class="layui-input-block">\n' +
                    '                            <input type="button" class="layui-btn layui-btn-normal" id="imgPath" value="复制图片链接地址(注意事项，请点击查看)" >\n' +
                    '                        </div>\n' +
                    '                    </div>\n' +
                    '                    <div class="layui-form-item ">\n' +
                    '                        <div class="layui-upload layui-input-block">\n' +
                    '                            <a href="javascript:;" class="layui-btn">点击上传文件\n' +
                    '                                <input type="file" multiple="true" id="fileId" onchange="showImg(this,\'#demo2\')"  />\n' +
                    '                            </a>\n' +
                    '                            <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">\n' +
                    '                                预览图：\n' +
                    '                                <div class="layui-upload-list" id="demo2"></div>\n' +
                    '                            </blockquote>\n' +
                    '                        </div>\n' +
                    '                    </div>\n' +
                    '                    <div class="layui-form-item">\n' +
                    '                        <div class="layui-input-block">\n' +
                    '                            <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>\n' +
                    '                            <button type="reset" class="layui-btn layui-btn-primary">重置</button>\n' +
                    '                            <button class="layui-btn layui-btn-danger" type="button" id="close">关闭</button>\n' +
                    '                        </div>\n' +
                    '                    </div>\n' +
                    '                </form>\n' +
                    '            </div>' +
                    '        </div>'
                ,success: function(layero){

                    layui.use(['form','element'], function() {
                        var form = layui.form
                            , $ = layui.jquery;

                        $("#message").val(data.message);

                        $("select[name=num]").val(data.num);

                        $("select[name=driving]").val(data.driving);

                        $("select[name=motor]").val(data.motor);

                        $("select[name=cell]").val(data.cell);

                        if(data.status){
                            $("input[name=lock]").prop("checked",true);
                        }


                        form.render();

                        $("#imgPath").click(function(){

                            if(data.imgs!=null&&data.imgs.length>0){
                                var sum = "  链接"+ 1 +"：http://localhost:8080/Smart/"+data.imgs[0].path;
                                for(var i = 1;i<data.imgs.length;i++){
                                    sum = sum + "  链接"+ (i+1) +"：http://localhost:8080/Smart/"+data.imgs[i].path;
                                }
                            }

                            layer.alert('当您编辑信息重新上传时，如有新添加图片，原先图片将会被删除，我们将提供图片路径，如有需要，请先保存。'+sum, {icon: 1});
                        })

                        //监听提交
                        form.on('submit(formDemo)', function(data){
                            if(count<3&&count!=0){
                                alert("图片至少3张")
                                return false;
                            }
                            if(data.field.money>100000000){
                                alert("您输入的金额过大，请调整！")
                                return false;
                            }
                            //alert(JSON.stringify(data.field));
                            //return false;
                            formData.append('jsonStr',JSON.stringify(data.field));

                            /*
                                提交数据
                             */
                            $.ajax({
                                url: "/Smart_Backstage/smart/uploadUpdate",
                                type: "POST",
                                secureuri:false,
                                cache: false,    //上传文件不需缓存
                                processData: false, //需设置为false。因为data值是FormData对象，不需要对数据做处理
                                contentType: false, //需设置为false。因为是FormData对象，且已经声明了属性enctype="multipart/form-data"
                                data: formData,
                                success: function (data) {
                                    if(data==1){
                                        layer.confirm('修改成功', {
                                            btn: ['好的'] //可以无限个按钮
                                            ,btn1: function(index, layero){
                                                layer.closeAll();
                                            }
                                        });

                                    }else{
                                        layer.alert('修改失败', {icon: 5});
                                    }
                                },
                                error: function () {
                                    layer.alert('请检查网络是否正常', {icon: 5});
                                }
                            });
                            return false;
                        });



                        /*
                            检验价格
                        */
                        form.verify({
                            price: [
                                /(^[1-9]\d*(\.\d{1,2})?$)|(^0(\.\d{1,2})?$)/
                                ,'请输入正确的价格'
                            ]
                        });


                        /*
                            检验mm
                        */
                        form.verify({
                            mm: [
                                /^\d{4}$/
                                ,'请输入正确的mm格式，如：1820'
                            ]
                        });

                        /*
                            检验车速
                        */
                        form.verify({
                            speed: [
                                /^\d{2,3}$/
                                ,'请输入正确的车速格式，如：200'
                            ]
                        });

                        /*
                            检验电池容量
                        */
                        form.verify({
                            capacity: [
                                /^\d{2,3}$/
                                ,'请输入正确的电池容量格式，如：66'
                            ]
                        });

                        /*
                            检验快充时间
                        */
                        form.verify({
                            time1: [
                                /^\d{2,3}$/
                                ,'请输入正确的时间格式，如：30'
                            ]
                        });

                        /*
                            检验慢充时间
                        */
                        form.verify({
                            time2: [
                                /^\d{1,2}$/
                                ,'请输入正确的时间格式，如：5'
                            ]
                        });




                    });


                    $("#close").click(function(){
                        layer.closeAll();
                    })


                }

            });

        }

        //查看的dialog
        function dialog2(id_){

            $.ajax({
                url:'/Smart_Backstage/smart/message',
                contentType:'application/json;charset=UTF-8',
                data:JSON.stringify(id_),
                dataType:'json',
                type:'post',
                success:function(data){
                    layer.open({
                        type: 1
                        ,title: false //不显示标题栏
                        ,closeBtn: false
                        ,area: ['1000px','500px']
                        ,shade: 0.8
                        ,id: 'LAY_layuipro' //设定一个id，防止重复弹出
                        ,btnAlign: 'c'
                        ,content:
                            '<div style="padding: 50px; line-height: 22px; background-color: #393D49; color: #fff; font-weight: 300;">' +
                            '    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;margin-bottom: 20px; margin-bottom: 40px;" >\n' +
                            '        <legend>查看商品信息</legend>\n' +
                            '    </fieldset>' +
                            '    <div style="font-family: 微软雅黑;font-weight: bold;font-size: 20px;">'+data.user.name+'</div>' +
                            '    <div style="font-family: 微软雅黑;font-weight: bold;font-size: 18px;padding: 20px;">标题：'+data.title+'</div>' +
                            '    <div style="font-family: 微软雅黑;font-size: 16px;padding-left: 20px; margin-bottom: 20px;">内容：'+data.message+'</div>' +
                            '    <div style="font-family: 微软雅黑;font-size: 18px;padding-left: 20px; margin-bottom: 20px; color: red;font-weight: bold;">全额：'+data.money+'</div>' +
                            '    <div>' +
                            '        <table class="layui-table">\n' +
                            '                <thead>\n' +
                            '                    <tr>\n' +
                            '                        <th>id</th>\n' +
                            '                        <th>长度(mm)</th>\n' +
                            '                        <th>宽度(mm)</th>\n' +
                            '                        <th>高度(mm)</th>\n' +
                            '                        <th>座位数</th>\n' +
                            '                        <th>驱动形式</th>\n' +
                            '                        <th>电机类型</th>\n' +
                            '                        <th>电池类型</th>\n' +
                            '                        <th>电池容量</th>\n' +
                            '                        <th>直流快充时间(30%->80%)</th>\n' +
                            '                        <th>交流慢充时间(30%->80%)</th>\n' +
                            '                        <th>最高车速</th>\n' +
                            '                        <th>发帖时间</th>\n' +
                            '                    </tr>\n' +
                            '                </thead>\n' +
                            '                <tbody>\n' +
                            '                    <tr>\n' +
                            '                        <td>'+data.id+'</td>\n' +
                            '                        <td>'+data.length+'</td>\n' +
                            '                        <td>'+data.width+'</td>\n' +
                            '                        <td>'+data.height+'</td>\n' +
                            '                        <td>'+data.num+'</td>\n' +
                            '                        <td>'+data.driving+'</td>\n' +
                            '                        <td>'+data.motor+'</td>\n' +
                            '                        <td>'+data.cell+'</td>\n' +
                            '                        <td>'+data.capacity+'kwh</td>\n' +
                            '                        <td><='+data.time1+'min</td>\n' +
                            '                        <td><='+data.time2+'h</td>\n' +
                            '                        <td>'+data.maxSpeed+'h/km</td>\n' +
                            '                        <td>'+showTime(data.date)+'</td>\n' +
                            '                    </tr>\n' +
                            '                </tbody>\n' +
                            '            </table>\n' +
                            '        </div>' +
                            '        <div class="layui-form-item ">\n' +
                            '            <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">\n' +
                            '                预览图：\n' +
                            '            <div class="layui-upload-list" id="imgDiv"></div>\n' +
                            '            </blockquote>\n' +
                            '        </div>' +
                            '        <div style="text-align: center; margin-top: 20px">' +
                            '            <button class="layui-btn" type="button" id="close">确定</button>' +
                            '        </div>' +
                            '    </div>' +
                            '</div>'
                        ,success: function(layero){
                            for(var i = 0;i<data.imgs.length;i++){
                                $("#imgDiv").append("<img src='http://localhost:8080/Smart/"+data.imgs[i].path+"'/>")
                                //$("#imgDiv").append("<img src='/Smart_Backstage/files/automobile_home.jpg' />")
                            }


                            layui.use('table', function(){
                                var table = layui.table;
                            });

                            $("#close").click(function(){
                                layer.closeAll();
                            })

                        }

                    });
                }
            })

        }

    });


</script>

<script>

    $(function(){
        $('.header').load('header.html');
        $('.left').load('aside.html');
        $('.footer').load('footer.html');
    })

    //JavaScript代码区域
    $("#content") .load("intoIndex",function () {

        layui.use('element', function(){
            var element = layui.element;
        });

    });
</script>


</body>
</html>